<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/resources/template/template.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:phi="http://java.sun.com/jsf/composite/pharmacy"
                xmlns:bi="http://java.sun.com/jsf/composite/bill"
                xmlns:pa="http://java.sun.com/jsf/composite/paymentMethod"
                xmlns:pat="http://java.sun.com/jsf/composite/patient">



    <ui:define name="content">


        <h:panelGroup rendered="#{!(webUserController.hasPrivilege('OpdBilling') or webUserController.hasPrivilege('LabCashier'))}" >
            You are NOT authorized
        </h:panelGroup>

        <h:panelGroup rendered="#{webUserController.hasPrivilege('OpdBilling') or webUserController.hasPrivilege('LabCashier')}" styleClass="opdPanel" >
            <h:form id="form">
                <p:growl autoUpdate="true" id="growl" ></p:growl>
                <p:focus id="focusIx" for="acIx" />
                <f:facet name="header">
                    <h:outputLabel value="OPD"/>
                </f:facet>
                <h:panelGroup rendered="#{!billController.printPreview}" styleClass="alignTop" >



                    <p:panel style="min-height: 600px; position:relative;"  >
                        <h:panelGrid columns="20"  >
                            <h:panelGrid columns="1">                                
                                <p:selectOneMenu   id="pay" value="#{billController.paymentMethod}">     
                                    <f:selectItems value="#{enumController.paymentMethods}"  />
                                    <p:ajax process="@this cmbPs" 
                                            update=":#{p:component('pBillDetails')}  tblBillItem creditCard cheque slip"
                                            event="change"
                                            listener="#{billController.changeListener()}"/>
                                </p:selectOneMenu>
                            </h:panelGrid>
                            <h:panelGrid columns="1">                            
                                <p:selectOneMenu   id="cmbPs" value="#{billController.paymentScheme}">     
                                    <f:selectItem itemLabel="Select Discount Scheme"/>
                                    <f:selectItems value="#{paymentSchemeController.paymentSchemesForOPD}" 
                                                   var="paysch" itemLabel="#{paysch.name}" itemValue="#{paysch}"  />
                                    <p:ajax process="@this pay" 
                                            update=":#{p:component('pBillDetails')} :#{p:component('creditCompany')} :#{p:component('creditStaff')}  tblBillItem creditCard cheque slip" 
                                            event="change" 
                                            listener="#{billController.changeListener()}"/>
                                </p:selectOneMenu>
                            </h:panelGrid>
                            <p:inputText value="#{billController.comment}" id="comment"/>
                            <p:watermark value="Comment" for="comment"/>


                            <h:panelGroup id="creditCard" style="display: #{billController.paymentMethod ne 'Card' ? 'none' : 'block'} ; ">
                                <pa:creditCard paymentMethodData="#{billController.paymentMethodData}"/>
                            </h:panelGroup>

                            <h:panelGroup id="cheque" style="display: #{billController.paymentMethod ne 'Cheque' ? 'none' : 'block'} ; " >
                                <pa:cheque paymentMethodData="#{billController.paymentMethodData}"/>
                            </h:panelGroup>

                            <h:panelGroup id="slip" style="display: #{billController.paymentMethod ne 'Slip' ? 'none' : 'block'} ;">
                                <pa:slip paymentMethodData="#{billController.paymentMethodData}"/>
                            </h:panelGroup>

                            <p:commandButton  value="Settle" action="#{billController.settleBill}" ajax="false"  style="width: 200px; padding: 1px;border: 1px solid ; margin: auto;">
                            </p:commandButton>
                            <p:commandButton value="New Bill" ajax="false" action="#{billController.prepareNewBill()}" >
                            </p:commandButton>
                            <p:commandButton value="Mark as Foreigner" action="#{billController.markAsForeigner}" rendered="#{!billController.foreigner}" ajax="false" ></p:commandButton>
                            <p:commandButton value="Mark as Local" action="#{billController.markAsLocal}" rendered="#{billController.foreigner}" ajax="false" ></p:commandButton>
                            <p:commandButton value="Print Last Bill" ajax="false" action="opd_bill_print_last" >
                            </p:commandButton>
                        </h:panelGrid>



                        <h:panelGrid columns="2" >

                            <h:panelGrid columns="1" >

                                <h:panelGroup id="panelPatient" >

                                    <p:tabView id="tvPt" activeIndex="#{billController.patientSearchTab}"  >
                                        <p:ajax event="tabChange"   process="@this"  
                                                update=":#{p:component('cmbPs')} :#{p:component('tblBillItem')} :#{p:component('pBillDetails')} "
                                                listener="#{billController.onTabChange}" />

                                        <p:tab id="tabNewPt" title="New Patient"   >
                                            <p:panel header="Enter New Patient Details" style="width: 550px;">

                                                <p:panelGrid columns="2" >
                                                    <p:selectOneMenu  id="cmbTitle"  style="width: 100px;"
                                                                      value="#{billController.newPatient.person.title}"  >
                                                        <f:selectItem itemLabel="Select Title" />
                                                        <f:selectItems value="#{billController.title}" var="i" 
                                                                       itemLabel="#{i.label}" itemValue="#{i}"/>
                                                    </p:selectOneMenu>

                                                    <p:inputText autocomplete="off"  id="txtNewPtName" placeholder="Enter the Name of the patient"
                                                                 value="#{billController.newPatient.person.name}" 
                                                                 style="min-width: 350px;text-transform:capitalize;">
                                                    </p:inputText>

                                                    <p:selectOneMenu id="txtNewSex"  value="#{billController.newPatient.person.sex}" style="width: 100px;">
                                                        <f:selectItem itemLabel="Select Gender"/>
                                                        <f:selectItems value="#{billController.sex}"/>
                                                    </p:selectOneMenu>

                                                    <h:panelGrid columns="4">
                                                        <p:inputText autocomplete="off"  id="year"  
                                                                     value="#{billController.yearMonthDay.year}" 
                                                                     style="width: 80px; ">
                                                            <f:ajax event="keyup" execute="@this month day" render="calNewPtDob" 

                                                                    listener="#{billController.dateChangeListen()}"  />
                                                        </p:inputText>
                                                        <p:inputText autocomplete="off" id="month"
                                                                     style="width: 80px; " value="#{billController.yearMonthDay.month}">
                                                            <f:ajax event="keyup" execute="@this year day" render="calNewPtDob" listener="#{billController.dateChangeListen()}"  />
                                                        </p:inputText>
                                                        <p:inputText autocomplete="off" id="day" 
                                                                     style="width: 80px;" value="#{billController.yearMonthDay.day}">
                                                            <f:ajax event="keyup" execute="@this year month" render="calNewPtDob" listener="#{billController.dateChangeListen()}" />
                                                        </p:inputText>
                                                        <p:calendar  value="#{billController.newPatient.person.dob}" 
                                                                     id="calNewPtDob"  navigator="true" pattern="dd/MM/yyyy" 
                                                                     style="width: 115px!important;"
                                                                     styleClass="shortinput">
                                                            <f:ajax event="dateSelect" />
                                                        </p:calendar>
                                                    </h:panelGrid>

                                                    <p:inputMask mask="999-9999999" id="txtNewPtPhone" 
                                                                 autocomplete="off" maxlength="11" placeholder="Phone Number"
                                                                 value="#{billController.newPatient.person.phone}"
                                                                 style="width: 135;">
                                                    </p:inputMask>

                                                    <p:inputText autocomplete="off" id="txtEmail" placeholder="Enter Email here"
                                                                 style="width: 350px;" value="#{billController.newPatient.person.email}">
                                                        <f:ajax event="keyup" execute="@this year month" render="calNewPtDob" listener="#{billController.dateChangeListen()}" />
                                                    </p:inputText>


                                                    <p:inputText style="width:135px;" placeholder="National ID No." value="#{billController.newPatient.person.nic}"/>
                                                    <p:autoComplete id="acNewPtArea" converter="areaCon" placeholder="Search &amp; Select Area"
                                                                    completeMethod="#{areaController.completeArea}" 
                                                                    var="pta" itemLabel="#{pta.name}" styleClass="shortinputOpd"
                                                                    itemValue="#{pta}" forceSelection="true" 
                                                                    value="#{billController.newPatient.person.area}" ></p:autoComplete>

                                                </p:panelGrid>
                                                <p:panelGrid columns="1" >
                                                    <p:inputText style="width:506px;" placeholder="Address" value="#{billController.newPatient.person.address}"/>
                                                </p:panelGrid>
                                                <p:watermark value="YEAR" for="year" />
                                                <p:watermark value="MONTH" for="month" />
                                                <p:watermark value="DAYS" for="day" />
                                                <p:watermark for="calNewPtDob" value="Birthday" ></p:watermark>
                                                <p:tooltip for="year" >
                                                    You can enter the age in years here. The system will calculate the approximate date of birth.
                                                </p:tooltip>
                                                <p:tooltip for="month" >
                                                    In children below five years, you may enter the age in months here. The system will use this data to calculate the approximate date of birth.
                                                </p:tooltip>
                                                <p:tooltip for="day" >
                                                    In children below one month, you may enter the age in days here. The system will use this to calculate the approximate date of birth.
                                                </p:tooltip>
                                                <p:tooltip for="calNewPtDob" >
                                                    Select Gender
                                                </p:tooltip>
                                                <p:tooltip for="cmbTitle" >
                                                    Select Title
                                                </p:tooltip>
                                                <p:tooltip for="txtNewPtName" >
                                                    Enter Patient Name
                                                </p:tooltip>
                                                <p:tooltip for="txtNewSex" >
                                                    Select Gender
                                                </p:tooltip>
                                                <p:tooltip for="acNewPtArea" >
                                                    Search Area
                                                </p:tooltip>
                                                <p:tooltip for="calNewPtDob" >
                                                    You can also enter the Date of Birth
                                                </p:tooltip>
                                                <p:tooltip for="txtEmail" >
                                                    Enter the email
                                                </p:tooltip>
                                                <p:tooltip for="txtNewSex" >
                                                    Select Gender
                                                </p:tooltip>
                                                <p:tooltip for="txtNewSex" >
                                                    Select Gender
                                                </p:tooltip>
                                            </p:panel>


                                        </p:tab>

                                        <p:tab id="tabSearchPt" title="Search Patient">

                                            <h:panelGrid columns="1" >
                                                <p:selectBooleanCheckbox value="#{patientController.reportKeyWord.additionalDetails}" 
                                                                         itemLabel="Serch Only Registed Patient" >
                                                    <f:ajax execute="@this" render="acPt" />
                                                </p:selectBooleanCheckbox>
                                                <p:autoComplete styleClass="mediuminput" converter="patientConverter"
                                                                disabled="#{billController.fromOpdEncounter}"
                                                                widgetVar="aPt" id="acPt" forceSelection="true" 
                                                                value="#{billController.searchedPatient}" 
                                                                completeMethod="#{patientController.completePatientByNameOrCode}" 
                                                                var="apt" itemLabel="#{apt.person.name}" 
                                                                itemValue="#{apt}" size="30"  style="width: 400px;"
                                                                minQueryLength="4">


                                                    <p:column headerText="Name">
                                                        <h:outputLabel value="#{apt.person.nameWithTitle}" />
                                                    </p:column>
                                                    <p:column headerText="Phone">
                                                        <h:outputLabel value="#{apt.person.phone}" />
                                                    </p:column>

                                                    <p:column headerText="Age">
                                                        <h:outputLabel value="#{apt.age}" />
                                                    </p:column>
                                                    <p:column headerText="Code">
                                                        <h:outputLabel value="#{apt.code}" />
                                                    </p:column>
                                                    <p:column headerText="Sex">
                                                        <h:outputLabel value="#{apt.person.sex}" />
                                                    </p:column>
                                                    <p:column headerText="Address">
                                                        <h:outputLabel value="#{apt.person.address}" />
                                                    </p:column>
                                                    <p:column headerText="Date of Birth">
                                                        <h:outputLabel value="#{apt.person.dob}" >
                                                            <f:convertDateTime pattern="dd MMMM yyyy"/>
                                                        </h:outputLabel>
                                                    </p:column>
                                                    <f:ajax event="itemSelect" execute=":#{p:component('cmbPs')} @this" 
                                                            render="panSearch :#{p:component('tblBillItem')} :#{p:component('pBillDetails')}" 
                                                            listener="#{billController.calTotals()}" />
                                                </p:autoComplete>   

                                                <h:panelGroup id="panSearch">
                                                    <pat:searchPatientDetail patient="#{billController.searchedPatient}"  />
                                                </h:panelGroup>

                                                <div style="padding: 2px; margin: 2px; border: 1px solid;">
                                                    <p:outputLabel value="#{pharmacySaleController.opdEncounterComments}" ></p:outputLabel>
                                                </div>

                                            </h:panelGrid>


                                        </p:tab>

                                    </p:tabView>

                                </h:panelGroup>

                                <h:panelGroup id="panelIx" >


                                    <p:panel id='pIxAdd' header="Items / Services"
                                             style="min-height: 350px;"  >



                                        <p:focus  context="acIx"/>

                                        <p:autoComplete widgetVar="aIx" id="acIx" forceSelection="true"
                                                        value="#{billController.currentBillItem.item}" 
                                                        completeMethod="#{itemController.completeOpdItemsByNamesAndCode}"
                                                        var="ix" itemLabel="#{ix.name}" itemValue="#{ix}"
                                                        size="10"  style="width: 400px;" maxResults="10" >
                                            <p:column style="max-width: 200px;" headerText="Name">
                                                <p:outputLabel value="#{ix.name}" ></p:outputLabel>
                                                <h:panelGroup rendered="#{ix.name ne ix.fullName}" >
                                                    <p:outputLabel value=" (#{ix.fullName})" ></p:outputLabel>
                                                </h:panelGroup>
                                            </p:column>
                                            <p:column style="max-width: 200px;" headerText="Dept">
                                                <h:outputLabel value="#{ix.department.name}"></h:outputLabel>
                                            </p:column>
                                            <p:column style="max-width: 200px;" headerText="Code">
                                                <h:outputLabel value="#{ix.code}"></h:outputLabel>
                                            </p:column>
                                            <p:column style="text-align: right; max-width: 80px;" headerText="Value">
                                                <h:outputLabel value="#{ix.total}"></h:outputLabel>
                                            </p:column>
                                            <p:ajax event="itemSelect"  listener="#{billController.fillBillSessions}" process="acIx" update="tblSs" ></p:ajax>
                                            <f:ajax event="itemSelect"  execute="@this" render="txtQty" />
                                        </p:autoComplete>
                                        <h:commandButton id="btnAddIx" value="Add" action="#{billController.addToBill()}"  style="width: 75px;"  >
                                            <f:ajax execute="txtQty acIx btnAddIx :#{p:component('cmbPs')} :#{p:component('pay')} panelBillItems" render="focusIx tblBillItem  :#{p:component('pBillDetails')}  pIxAdd" />
                                        </h:commandButton>

                                        <h:panelGrid id="txtQty">
                                            <h:inputText autocomplete="off" 
                                                         rendered="#{billController.currentBillItem.item.requestForQuentity}"
                                                         value="#{billController.currentBillItem.qty}" >
                                            </h:inputText>
                                        </h:panelGrid>
                                        <p:selectOneMenu value="#{itemController.reportKeyWord.department}">     
                                            <f:selectItem itemLabel="Filter by Department"/>
                                            <f:selectItems value="#{departmentController.labs}" 
                                                           var="paysch" itemLabel="#{paysch.name}" itemValue="#{paysch}"  />
                                            <p:ajax process="@this" update="acIx" event="change"/>
                                        </p:selectOneMenu><br></br>
                                        <p:calendar value="#{billController.currentBillItem.item}" pattern="dd MMMM yyyy hh:mm a" ></p:calendar>
                                        <!--<p:defaultCommand target="btnAddIx" />-->
                                        <p:panel header="Session"  >
                                            <p:calendar id="calS" mode="inline" value="#{billController.sessionDate}" pattern="dd MMMM yyyy" >
                                                <f:ajax event="dateSelect" execute="calS" render="tblSs :#{p:component('lblTemS')}" listener="#{billController.fillBillSessionsLstner}" />
                                            </p:calendar>
                                            <p:selectOneMenu value="#{itemController.reportKeyWord.department}">     
                                                <f:selectItem itemLabel="Select Department"/>
                                                <f:selectItems value="#{departmentController.labs}" 
                                                               var="paysch" itemLabel="#{paysch.name}" itemValue="#{paysch}"  />
                                                <p:ajax process="@this" update="acIx" event="change"/>
                                            </p:selectOneMenu><br></br>
                                            <p:dataTable id="tblSs" value="#{billController.billSessions}" var="bs" emptyMessage="No Numbers Yet">
                                                <f:facet name="header">
                                                    <h:outputLabel value="#{billController.lastBillItem.item.name}" />

                                                    <h:outputLabel id="lblTemS" value="#{billController.sessionDate}" >
                                                        <f:convertDateTime pattern="dd MMM yyyy" ></f:convertDateTime>
                                                    </h:outputLabel>



                                                </f:facet>
                                                <p:column headerText="No.">
                                                    <h:outputLabel value="#{bs.serialNo}" />
                                                </p:column>
                                                <p:column headerText="Client">
                                                    <h:outputLabel value="#{bs.billItem.bill.patient.person.nameWithTitle}" />
                                                </p:column>
                                            </p:dataTable>
                                        </p:panel>
                                    </p:panel>



                                </h:panelGroup>

                            </h:panelGrid>


                            <h:panelGrid columns="1" >




                                <h:panelGroup id="panelBillReferrals" >
                                    <h:panelGrid columns="3" >
                                        <p:outputLabel value="Referring Institution" ></p:outputLabel>
                                        <p:autoComplete id="refIns" forceSelection="true" 
                                                        value="#{billController.referredByInstitution}"
                                                        completeMethod="#{institutionController.completeIns}"
                                                        var="ri" 
                                                        itemLabel="#{ri.name}" 
                                                        itemValue="#{ri}" 
                                                        size="30"  
                                                        style="width: 400px;">
                                            <f:ajax  event="itemSelect" execute="creditCom"  />
                                            <p:column>#{ri.institutionCode}</p:column>
                                            <p:column>#{ri.name}</p:column>
                                        </p:autoComplete>
                                        <p:spacer></p:spacer>
                                            
                                        <p:outputLabel value="Referring Doctor" ></p:outputLabel>
                                        <p:autoComplete forceSelection="true" id="cmbDoc" value="#{billController.referredBy}" 
                                                        completeMethod="#{doctorController.completeDoctor}" var="ix" 
                                                        itemLabel="#{ix.person.name}" itemValue="#{ix}" size="30"  style="width: 400px;">
                                            <p:column headerText="Name" >
                                                <h:outputLabel value="#{ix.person.nameWithTitle}" ></h:outputLabel>
                                            </p:column>
                                            <p:column headerText="Code" >
                                                <h:outputLabel value="#{ix.code}" ></h:outputLabel>
                                            </p:column>
                                        </p:autoComplete>
                                        <h:panelGroup >
                                            <p:commandLink id="btnAddNewDoc" type="button"  value="Add" oncomplete="PF('dlg').show();" 
                                                           actionListener="#{doctorController.prepareAdd}"  
                                                           process="btnAddNewDoc" update="#{p:component('panDoc')}" />  
                                            <p:dialog id="panDoc" header="Add New Doctor" widgetVar="dlg" resizable="false" modal="true">  



                                                <h:panelGrid columns="2" style="margin-bottom:10px">  
                                                    <p:outputLabel id="lblNameD" value="Name" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtNameD"  value="#{doctorController.current.person.name}"  ></h:inputText>
                                                    <p:outputLabel id="lblPhoneD" value="Phone" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtPhoneD" value="#{doctorController.current.person.phone}"  ></h:inputText>
                                                    <p:outputLabel id="lblFaxD" value="Fax" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtFaxD" value="#{doctorController.current.person.fax}"  ></h:inputText>
                                                    <p:outputLabel id="lblMobileD" value="Mobile" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtMobileD" value="#{doctorController.current.person.mobile}"  ></h:inputText>
                                                    <p:outputLabel id="lblAddressD" value="Address" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtAddressD" value="#{doctorController.current.person.address}"  ></h:inputText>
                                                    <p:outputLabel value="Code"></p:outputLabel>   
                                                    <h:inputText autocomplete="off" id="txtCodeD" value="#{doctorController.current.code}"  ></h:inputText>
                                                    <p:outputLabel value="Speciality" ></p:outputLabel>
                                                    <p:selectOneMenu id="cmbSpecialityD" value="#{doctorController.current.speciality}" >
                                                        <f:selectItem itemLabel="Please select a speciality"/>
                                                        <f:selectItems value="#{doctorSpecialityController.items}" var="cat" itemLabel="#{cat.name}" itemValue="#{cat}" />
                                                    </p:selectOneMenu>
                                                    <p:outputLabel id="lblRegD" value="Registration" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtRegD" value="#{doctorController.current.registration}"  ></h:inputText>                 
                                                    <p:outputLabel id="lblQuaD" value="Qualification" ></p:outputLabel>
                                                    <h:inputText autocomplete="off" id="txtQuaD" value="#{doctorController.current.qualification}"  ></h:inputText>   

                                                    <p:commandButton id="btnDocSave" value="Add New" process="btnDocSave panDoc" update="panDoc :#{p:component('cmbDoc')}" actionListener="#{doctorController.saveSelected()}" styleClass="buttons" oncomplete="dlg.hide();">
                                                    </p:commandButton>

                                                </h:panelGrid>  

                                            </p:dialog> 



                                        </h:panelGroup>

                                        <p:outputLabel value="Collecting Centre" />
                                        <p:autoComplete id="creditCom" forceSelection="true" 
                                                        value="#{billController.collectingCentre}"  completeMethod="#{institutionController.completeCollectingCenter}" var="ix" itemLabel="#{ix.name}" itemValue="#{ix}" size="30"  style="width: 400px;">
                                            <f:ajax  event="itemSelect" execute="creditCom"  />
                                            <p:column>#{ix.institutionCode}</p:column>
                                            <p:column>#{ix.name}</p:column>
                                        </p:autoComplete>
                                        <h:panelGroup >
                                            <p:watermark for="creditCom" value="Type at least 3 charactors of Collecting Centre." ></p:watermark>
                                            <p:commandLink id="btnAddNewCc" value="Add" ajax="false" action="/lab/collecting_centre"
                                                           actionListener="#{collectingCentreController.prepareAdd()}"  />  

                                        </h:panelGroup>
                                        <p:outputLabel value="Credit Company"></p:outputLabel>
                                        <p:autoComplete id="creditCompany" 
                                                        forceSelection="true"
                                                        value="#{billController.creditCompany}"  
                                                        completeMethod="#{creditCompanyController.completeCredit}" var="ix" 
                                                        itemLabel="#{ix.name}" itemValue="#{ix}" size="30"  style="width: 300px;">

                                            <f:ajax  event="itemSelect" listener="#{billController.calTotals()}"
                                                     execute="@this" 
                                                     render=":#{p:component('panelBillTotals')}  :#{p:component('tblRequests')} :#{p:component('tblBillItem')}" />
                                        </p:autoComplete> 
                                        <h:panelGroup >
                                            <p:watermark for="creditCompany" value="Type at least 3 charactors of Credit Company." ></p:watermark>
                                            <p:commandLink id="btnAddNewCreditCom" value="Add" ajax="false" action="/lab/credit_company"
                                                           actionListener="#{creditCompanyController.prepareAdd()}" />  

                                        </h:panelGroup>
                                        <p:outputLabel value="Staff Mamber"></p:outputLabel>
                                        <p:autoComplete  style="width: 300px;" 
                                                         forceSelection="true" 
                                                         value="#{billController.toStaff}" 
                                                         id="creditStaff"
                                                         completeMethod="#{staffController.completeStaff}" 
                                                         var="mys" 
                                                         itemLabel="#{mys.person.nameWithTitle}" 
                                                         itemValue="#{mys}"
                                                         converter="stfcon" >
                                            <p:column headerText="Name" >
                                                <h:outputLabel value="#{mys.person.nameWithTitle}" ></h:outputLabel>
                                            </p:column>
                                            <p:column headerText="Annual Entitlement">
                                                <h:outputLabel value="#{mys.annualWelfareQualified}" >
                                                    <f:convertNumber pattern="#,##0.00" ></f:convertNumber>
                                                </h:outputLabel>
                                            </p:column>
                                            <p:column  headerText="Annual Utilized Value">
                                                <h:outputLabel value="#{mys.annualWelfareUtilized}" >
                                                    <f:convertNumber pattern="#,##0.00" ></f:convertNumber>
                                                </h:outputLabel>
                                            </p:column>

                                            <p:ajax process="@this" 
                                                    update="creditCompany :#{p:component('panelBillTotals')}  :#{p:component('tblRequests')} :#{p:component('tblBillItem')}"
                                                    event="itemSelect"  listener="#{billController.calTotals()}" />

                                        </p:autoComplete>

                                        <p:watermark for="creditStaff" value="Type at least 3 charactors of Staff member." ></p:watermark>

                                    </h:panelGrid>
                                </h:panelGroup>



                                <h:panelGroup id="panelBillItems" >
                                    <p:tabView id="tblBillItem" >
                                        <p:tab id="tabBillItems" title="Bill Items" >
                                            <p:dataTable id="tblRequests" rowIndexVar="rowIndex" value="#{billController.lstBillEntries}" var="bi" >

                                                <p:column>
                                                    <f:facet name="header">No</f:facet>
                                                        #{rowIndex+1}
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Item</f:facet>
                                                        #{bi.billItem.item.name}
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Fee</f:facet>
                                                    <h:outputLabel value="#{bi.billItem.netValue}">
                                                        <f:convertNumber pattern="#,##0.00" />
                                                    </h:outputLabel>
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Department</f:facet>
                                                        #{bi.billItem.item.department.name}
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Priority</f:facet>
                                                    <p:selectOneMenu value="#{bi.billItem.priority}"    >
                                                        <p:ajax event="blur" process="@this" ></p:ajax>
                                                        <f:selectItem itemLabel="Not Set" ></f:selectItem>
                                                        <f:selectItems value="#{enumController.priorities}" ></f:selectItems>
                                                    </p:selectOneMenu>
                                                </p:column>
                                                <p:column>
                                                    <h:commandButton id="btnRemove" value="X" action="#{billController.removeBillItem}" >
                                                        <f:setPropertyActionListener  value="#{rowIndex}" target="#{billController.index}" />
                                                        <p:ajax  process="btnRemove" update=":#{p:component('tblBillItem')} :#{p:component('pBillDetails')}" />
                                                    </h:commandButton>
                                                </p:column>
                                            </p:dataTable>
                                        </p:tab>
                                        <p:tab id="tabBillIx" title="Tests" >
                                            <p:dataTable rowIndexVar="rowIndex" value="#{billController.lstBillComponents}" var="bix" >
                                                <p:column>
                                                    <f:facet name="header">No</f:facet>
                                                        #{rowIndex+1}
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Name</f:facet>
                                                        #{bix.item.name}
                                                </p:column>

                                            </p:dataTable>
                                        </p:tab>

                                        <p:tab id="tabBillFee" title="Fees" >
                                            <p:dataTable rowIndexVar="rowIndex" value="#{billController.lstBillFees}" var="bif" >
                                                <p:column>
                                                    <f:facet name="header">Item Name</f:facet>
                                                    <h:outputLabel value="#{bif.billItem.item.name}" />
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Fee</f:facet>
                                                    <h:inputText autocomplete="off"  required="true" requiredMessage="Please Check Changed Fees.Please enter correct value or Zero"
                                                                 id="txtFeeVal" 
                                                                 value="#{bif.feeGrossValue}" disabled="#{!bif.billItem.item.userChangable}" >
                                                        <f:convertNumber pattern="#,##0.00" />
                                                        <f:ajax event="keyup" execute="@this" 
                                                                render=":#{p:component('tblRequests')}  :#{p:component('pBillDetails')}"
                                                                listener="#{billController.feeChangeListener(bif)}" />
                                                    </h:inputText>
                                                </p:column>
                                                <p:column>
                                                    <p:commandButton ajax="false" value="Update" action="#{billController.feeChangeListener(bif)}" />
                                                </p:column>
                                                <p:column>
                                                    <f:facet name="header">Fee Name</f:facet>
                                                    <h:outputLabel value="#{bif.fee.name}" rendered="#{bif.fee !=null}" ></h:outputLabel>
                                                </p:column>



                                                <p:column>
                                                    <f:facet name="header">Speciality</f:facet>
                                                    <h:outputLabel value="#{bif.fee.speciality.name}" rendered="#{bif.fee !=null and bif.fee.speciality!=null}" ></h:outputLabel>
                                                </p:column>

                                                <p:column>
                                                    <f:facet name="header">Payee</f:facet>                                                
                                                    <p:selectOneMenu value="#{bif.staff}" rendered="#{bif.fee.speciality!=null}" filter="true" filterMatchMode="contains">
                                                        <f:selectItem itemLabel="Select Staff" />
                                                        <f:selectItems  value="#{staffController.getSpecialityStaff(bif.fee.speciality)}" var="bifs" itemLabel="#{bifs.person.name}" itemValue="#{bifs}" />
                                                    </p:selectOneMenu>

                                                </p:column>
                                            </p:dataTable>
                                        </p:tab>
                                    </p:tabView>
                                </h:panelGroup>


                                <h:panelGroup>
                                    <h:panelGroup id="panelBillTotals" >
                                        <p:panel header="Bill Details" id="pBillDetails"  >
                                            <p:panelGrid columns="2" columnClasses="numberCol, textCol"  >
                                                <h:outputLabel value="Total" ></h:outputLabel >
                                                <h:outputLabel id="tot" value="#{billController.total}" >
                                                    <f:convertNumber pattern="#,##0.00" />
                                                </h:outputLabel>
                                                <h:outputLabel value="Discount" ></h:outputLabel>
                                                <h:outputLabel id="dis" value="#{billController.discount}" >
                                                    <f:convertNumber pattern="#,##0.00" />
                                                </h:outputLabel>
                                                <h:outputLabel value="Net Total" ></h:outputLabel>
                                                <h:outputLabel id="netTotal" value="#{billController.netTotal}" >
                                                    <f:convertNumber pattern="#,##0.00" />
                                                </h:outputLabel>
                                                <h:outputLabel value="VAT" ></h:outputLabel>
                                                <h:outputLabel id="netTotalVat" value="#{billController.vat}" >
                                                    <f:convertNumber pattern="#,##0.00" />
                                                </h:outputLabel>
                                                <h:outputLabel value="Tendered" ></h:outputLabel>
                                                <p:inputText autocomplete="off"  id="paid" value="#{billController.strTenderedValue}" >
                                                    <!--<p:ajax process="netTotal paid" update="balance" event="change"/>-->
                                                    <p:ajax event="keyup" process="netTotal paid" update="balance netTotal" listener="#{billController.calTotals()}"/>
                                                </p:inputText>
                                                <h:outputLabel  value="Balance " ></h:outputLabel>
                                                <h:outputLabel id="balance" value="#{billController.cashBalance}" >
                                                    <f:convertNumber pattern="#,##0.00" />
                                                </h:outputLabel>
                                            </p:panelGrid>

                                        </p:panel>
                                    </h:panelGroup>

                                </h:panelGroup>


                            </h:panelGrid>


                        </h:panelGrid>
                    </p:panel>
                </h:panelGroup>



                <h:panelGroup rendered="#{sessionController.loggedPreference.opdBillPaperType eq 'FiveFivePrintedPaper'}">
                    <div class="nonPrintBlock">
                        <p:commandButton value="Print" 
                                         process="@this" 
                                         update="@all" 
                                         type="button"  
                                         ajax="false">
                            <p:printer target="gpBillPreview" ></p:printer>
                        </p:commandButton>

                        <p:commandButton value="New Bill" ajax="false" action="#{billController.prepareNewBill()}" >
                        </p:commandButton>
                        <p:commandButton ajax="false" value="Batch Cancel" action="#{billController.cancellAll}" style="float: right;"
                                         onclick="if (!confirm('Are you sure you want to Cancel This Bill ?'))
                                                     return false;"/>
                    </div>
                    <p:outputLabel value="Balance = #{billController.cashBalance}" style="font-weight: bold;font-size: 20pt;color: red;"/>
                    <h:panelGroup id="gpBillPreview">
                        <ui:repeat value="#{billController.bills}" var="bill">
                            <bi:opdBillPrintRuhunu bill="#{bill}" dup="false"/>
                        </ui:repeat>
                    </h:panelGroup>
                </h:panelGroup>

                <h:panelGroup rendered="#{sessionController.loggedPreference.opdBillPaperType eq 'FiveFivePaper'}">
                    <div class="nonPrintBlock">
                        <p:commandButton value="Print" ajax="false" action="#"  >
                            <p:printer target="fiveFivePaperWithHeadings" ></p:printer>
                        </p:commandButton>

                        <p:commandButton value="New Bill" ajax="false" action="#{billController.prepareNewBill()}" >
                        </p:commandButton>

                        <p:commandButton ajax="false" value="Batch Cancel" action="#{billController.cancellAll}" style="float: right;"
                                         onclick="if (!confirm('Are you sure you want to Cancel This Bill ?'))
                                                     return false;"/>
                    </div>
                    <h:panelGroup id="fiveFivePaperWithHeadings">
                        <ui:repeat value="#{billController.bills}" var="b">
                            <bi:five_five_paper_with_headings bill="#{b}"/>                        
                        </ui:repeat>
                    </h:panelGroup>
                </h:panelGroup>

                <h:panelGroup rendered="#{sessionController.loggedPreference.opdBillPaperType eq 'PosPaper'}">
                    <h:panelGrid rendered="#{sessionController.loggedPreference.opdPosBillWithoutLogo eq false}">
                        <div class="nonPrintBlock">
                            <p:commandButton value="Print" ajax="false" action="#"  >
                                <p:printer target="gpPosBill" ></p:printer>
                            </p:commandButton>



                            <p:commandButton value="New Bill" ajax="false" action="#{billController.prepareNewBill()}" >
                            </p:commandButton>

                            <p:commandButton ajax="false" value="Batch Cancel" action="#{billController.cancellAll}" style="float: right;"
                                             onclick="if (!confirm('Are you sure you want to Cancel This Bill ?'))
                                                         return false;"/>
                        </div>
                        <h:panelGroup id="gpPosBill">
                            <div style="page-break-after: always;">

                                <ui:repeat value="#{billController.bills}" var="b">
                                    <bi:posOpdBill bill="#{b}" duplicate="false"/>                        
                                </ui:repeat>
                            </div>
                            <div></div>
                            <div style="page-break-after: always;">

                                <ui:repeat value="#{billController.bills}" var="b">
                                    <bi:posOpdBill bill="#{b}" duplicate="false"/>                        
                                </ui:repeat>
                            </div>
                        </h:panelGroup>
                    </h:panelGrid>




                    <h:panelGrid rendered="#{sessionController.loggedPreference.opdPosBillWithoutLogo eq true}">
                        <div class="nonPrintBlock">
                            <p:commandButton value="Print" ajax="false" action="#"  >
                                <p:printer target="gpPosBillWithoutLogo" ></p:printer>
                            </p:commandButton>

                            <p:commandButton value="New Bill" ajax="false" action="#{billController.prepareNewBill()}" >
                            </p:commandButton>

                            <p:commandButton ajax="false" value="Batch Cancel" action="#{billController.cancellAll}" style="float: right;"
                                             onclick="if (!confirm('Are you sure you want to Cancel This Bill ?'))
                                                         return false;"/>
                        </div>
                        <h:panelGroup id="gpPosBillWithoutLogo">
                            <div style="page-break-after: always;">

                                <ui:repeat value="#{billController.bills}" var="b">
                                    <bi:posOpdBillWithoutLogo bill="#{b}" duplicate="false"/>                        
                                </ui:repeat>
                            </div>     
                            <div style="page-break-after: always;">

                                <ui:repeat value="#{billController.bills}" var="b">
                                    <bi:posOpdBillWithoutLogo bill="#{b}" duplicate="false"/>                        
                                </ui:repeat>
                            </div>  
                        </h:panelGroup>
                    </h:panelGrid>

                </h:panelGroup>



            </h:form>

        </h:panelGroup>
    </ui:define>
</ui:composition>
